<%@ page language="java" contentType="text/html; charset=utf-8"
	pageEncoding="utf-8"%>
<%@taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%>
<%@ page isELIgnored="false"%>
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>幸福巢后台管理</title>
<link rel="shortcut icon" href="../images/logo.png">
<script type="text/javascript" src="../js/jquery-1.11.3.min.js"></script>
<link type="text/css" rel="stylesheet" href="../css/bootstrap.min.css">
<link type="text/css" rel="stylesheet" href="../css/backHome.css">
<script type="text/javascript" src="../js/bootstrap.min.js"></script>
<script type="text/javascript" src="../js/backhome.js"></script>
<link rel="stylesheet" href="../css/new_global.css" type="text/css">
<link rel="stylesheet" href="../css/new_mall.css" type="text/css">
<script src="../js/back.js"></script>

</head>
<body>
	<div class="header">
		<div class="header_top">
			<div class="header_top_center">
				<div class="header_top_right">
					<ul>
						<li>
							<span class="htr_line"></span>
							<label id="nav_user_data"> <a href="../login.jsp"
								class="htr_login" rel="nofollow">管理员</a>
						</label>

						</li>
					
						<li>
							
						</li>

					</ul>
					<div class="user_home" style="display: none"></div>
				</div>
				<div class="header_top_left">
					<ul>
						<li><a href="../index.jsp" rel="nofollow">幸福巢首页</a> <span
							class="htr_line" style="display: none;" name="zcbTab"></span></li>

					</ul>
				</div>
			</div>
		</div>
		<!--logo部分-->
		<div class="header_bottom">
			<div class="header_bottom_logo">
				<a> <img id="logoimg" style="width: 133px; height: 107px;"
					src="../images/logo.png" alt="logo" />
				</a>
			</div>
			<div class="header_bottom_right">
				<span style="color: #000000; font-size: 20pt; font-style: inherit">后台中心</span>
			</div>
			<div style="margin-left:80%;margin-top:7%;">
				<button type="button" class="btn btn-success" aria-label="Left Align" onclick="refresh()">
				  <span class="glyphicon glyphicon-refresh" aria-hidden="true"></span>
				</button>
			</div>
			
		</div>
		<div class="header_hr"
			style="width: 100%; height: 3px; background: #007f41;">
			
			</div>
		
	</div>
	<div class="content">
		<div class="content_center">
			<dvi class="content_nav" style="display:none"> </dvi>
			<div class="content_center_left">
				<div>
					<div class="main " style="width: 100%;">
						<div class="left-sider">
							<div class="operate">
								<h3 style="padding-left: 30px;">
									<a href="#" class="person_center">个人中心</a>
								</h3>
								<ul id="juheweb">
									<li>
										<h4>服务管理</h4>
										<div class="list-item none">
											<p>
												<a href="#" class="order_board">匹配管理</a>
											</p>
											<p>
												<a href="#" class="address_board">服务评价</a>
											</p>
											<p>
												<a href="# " class="alterpwd_board">已完成服务</a>
											</p>
										</div>
									</li>
									<li>
										<h4>老年人管理</h4>
										<div class="list-item none">
											<p>
												<a href="#" class="effect_pic_board">老年人资料</a>
											</p>
											<p>
												<a href="#" class="collect_board"></a>
											</p>

										</div>
									</li>

									<li>
										<h4>志愿者管理</h4>
										<div class="list-item none">

											<p>
												<a href="#" class="usermsg_board">志愿者资料</a>
											</p>
											<p>
												<a href="# " class="alterpwd_board"></a>
											</p>
											
										</div>
									</li>

								</ul>
								<script type="text/javascript" language="javascript">
                                    navList(12);
                                </script>
							</div>
						</div>
					</div>
				</div>
			</div>
			<!--各个板块的内容-->

			<div class="content_center_right">
				<div style="border: #eeeeee solid 1px">
					<ul>
						<!---个人中心-->
						<li id="userhome" class="center_right_dis_none ">
							<div class="show">
								<div class="show_top">
									<div class="customer_header">
										<img src="../images/header_default_01.png">
									</div>

									<div class="customer_descript">
										<ul>
											<li class>管理员你好
												<button class="btn-style">幸福巢数据展示</button>
											</li>
											<li>志愿者总数:<span class="red_font">${backvolunteer.size()}</span>位
											</li>
											<li>老年人总数:<span class="red_font">${backelder.size()}</span>位
											</li>
											<li>待审核志愿服务数:<span class="red_font">${backorderlist.size()}</span>条
											</li>
											<li>志愿服务数:<span class="red_font">${backorderitem.size()}</span>条
											</li>

										</ul>
									</div>

								</div>
								<div class="show_bottom">
									<div class="show_bottom_header">
										<p>
											<span class="hr_span"> </span><span>后台管理流程</span>
										</p>
									</div>

									<div class="recomendation">
										<div class="recomendation_show">
											<ul>
												<li>
													<div class="product">
														
														<div>
															<p class="pric_msg">
																<span class="cur_pric">审核服务申请</span>
															</p>
															<p class="pri_total">
																<span>如志愿者条件不符合要求，则删除；如志愿者条件满足要求，则选择审核通过。</span>
															</p>
														</div>
													</div>
												</li>
												<li>
													<div class="product">
														
														<div>
															<p class="pric_msg">
																<span class="cur_pric">评价志愿者服务</span>
															</p>
															<p class="pri_total">
																<span>通过审核的志愿者服务进入待评价列表。</span>
															</p>
														</div>
													</div>
												</li>
												<li>
													<div class="product">
														<div>
															<p class="pric_msg">
																<span class="cur_pric">评分参照标准</span>
															</p>
															<p class="pri_total">
																<span>志愿者的服务积分由服务时长（占50％）、服务态度（占20％）、服务质量（占30％）三个维度构成，态度和质量以1-10分进行评价，1分为最低分，10分为最高分。</span>
															</p>
														</div>
													</div>
												</li>
											</ul>
										</div>
									</div>
									
								</div>
							</div>
						</li>
						<li id="alterpwd" class="center_right_dis_none ">
							<div class="change_customer_msg" style="width: 100%;">
								<div class="change_header">
									<p>
										<span class="msg-header_font">服务信息</span>
									</p>
								</div>
								<div class="mgs_content">
									<div class="right_content" style="width: 100%; height: 480px;">
										<h3 class="mall_title">已完成服务列表</h3>
										<div class="mall_right_main">
											<div class="messrs_box">
												<table>
													<tr class="mes_th">
														<td>编号</td>
														<td>志愿者</td>
														<td>老年人</td>
														<td>服务完成日期</td>
														<td>最终评分</td>
													</tr>
													<c:forEach items="${backorderitem}" var="tabbean">
														<c:if test="${tabbean.getIsFlag() eq 1}">
														<form>
														<tr>
															<td>${tabbean.getAid()}</td>	
															<td>${tabbean.getVname()}</td>
															<td>${tabbean.getEuname()}</td>
															<td>${tabbean.getAdate()}</td>
															<td><a href="javascript:void(0);" 
															class="revise_btn">${tabbean.getAscore()}</a></td>
														</tr>
														</form>
														</c:if>
													</c:forEach>
												</table>
											</div>
										</div>
									</div>
								</div>

						</div>
						</li>
						<!--修改个人资料-->
						<li id="alterusermag" class="center_right_dis_none ">
							<div class="change_customer_msg" style="width: 100%;">
								<div class="change_header">
									<p>
										<span class="msg-header_font">志愿者信息</span>
									</p>
								</div>
								<div class="mgs_content">
									<div class="right_content" style="width: 100%; height: 480px;">
										<h3 class="mall_title">志愿者列表</h3>
										<div class="mall_right_main">
											<div class="messrs_box">
												<table>
													<tr class="mes_th">
														<td>编号</td>
														<td>名字</td>
														<td>用户名</td>
														<td>性别</td>
														<td>类型</td>
														<td>地址</td>
														<td>电话</td>
														<td>服务日期</td>
														<td>开始</td>
														<td>结束</td>
														<td>积分</td>
														<td>选择</td>
													</tr>
													<c:forEach items="${backvolunteer}" var="tabbean">
														<tr>
															<td>${tabbean.getVid()}</td>
															<td>${tabbean.getVname()}</td>
															<td>${tabbean.getVuname()}</td>
															<td>${tabbean.getVsex()}</td>
															<td>${tabbean.getVtype()}</td>
															<td>${tabbean.getVaddress()}</td>
															<td>${tabbean.getVphone()}</td>
															<td>${tabbean.getVdate()}</td>
															<td>${tabbean.getVtimeStart()}</td>
															<td>${tabbean.getVtimeEnd()}</td>
															<td>${tabbean.getVscore()}</td>
															<td><a href="javascript:void(0);"
																class="revise_btn">${tabbean.getIsChoose()}</a></td>
														</tr>
													</c:forEach>
												</table>
											</div>
										</div>
									</div>
								</div>

						</div>
						</li>
						
						<!--收货地址-->
						<li id="userAddress" class="center_right_dis_none ">
							<div class="change_customer_msg" style="width: 100%;">
								<div class="change_header">
									<p>
										<span class="msg-header_font">志愿者评价</span>
									</p>
								</div>
								<div class="mgs_content">
									<div class="right_content" style="width: 100%; height: 480px;">
										<h3 class="mall_title">评价志愿者服务</h3>
										<div class="mall_right_main">
											<div class="messrs_box">
												<table>
													<tr class="mes_th">
														<td>编号</td>
														<td>服务类型</td>
														<td>志愿者</td>
														<td>老人</td>
														<td style="width:15%">服务时长</td>
														<td>态度</td>
														<td>质量</td>
														<td>最终评分</td>
														<td>操作</td>
													</tr>
													<c:forEach items="${backorderitem}" var="tabbean">
													<c:if test="${tabbean.getIsFlag() eq 0}">
														<form>
														<tr>
															<td id="aid">${tabbean.getAid()}</td>	
															<td>${tabbean.getVtype()}</td>
															
															<td>${tabbean.getVname()}</td>
															<td>${tabbean.getEuname()}</td>
															<td><input type="number" class="form-control" style="width: 45%" id="during" value="0"></td>
															<td>
																<select class="form-control" style="width: 100%" name="attitude" id="attitude">
											                      <option>良好</option>
											                      <option>优秀</option>
											                      <option>不合格</option>
											                  	</select>
										                  	</td>
															<td>
																<select class="form-control" style="width: 100%" name="quality" id="quality">
											                      <option>良好</option>
											                      <option>优秀</option>
											                      <option>不合格</option>
											                  	</select>
															</td>
															
															<td id="score${tabbean.getAid()}"></td>
															
															<td><a href="javascript:void(0);"
																onclick="assessVolunteer(${tabbean.getAid()},${tabbean.getVid()},${tabbean.getEid()})"
																class="revise_btn">确定评价</a></td>
														</tr>
														</form>
														</c:if>
													</c:forEach>
												</table>
											</div>
								<script>
								
								$("#during").focusout(function() {
									var aid=$("#aid").text();
									var during=$("#during").val();
									var attitude=$("#attitude").val();
									var quality=$("#quality").val();
									getScore(aid,during,attitude,quality);
								});
								$("#attitude").focusout(function() {
									var aid=$("#aid").text();
									var during=$("#during").val();
									var attitude=$("#attitude").val();
									var quality=$("#quality").val();
									getScore(aid,during,attitude,quality);
								});
								$("#quality").focusout(function() {
									var aid=$("#aid").text();
									var during=$("#during").val();
									var attitude=$("#attitude").val();
									var quality=$("#quality").val();
									getScore(aid,during,attitude,quality);
								});
								function getScore(aid,during,attitude,quality){
									var duringScore=during*2*0.5;
									var attitude=attitude;
									var quality=quality;
									if(duringScore>5){
										duringScore=5;
									}
									if(attitude=="优秀"){
										attitude=10;
									}else if(attitude=="良好"){
										attitude=5;
									}else if(attitude=="不及格"){
										attitude=0;
									}
									if(quality=="优秀"){
										quality=10;
									}else if(quality=="良好"){
										quality=5;
									}else if(quality=="不及格"){
										quality=0;
									}

									var scoreCount=duringScore+attitude*0.2+quality*0.3;
									$("#score"+aid).text(scoreCount);
								}
						           
		        </script>
										</div>
									</div>
								</div>

						</div>
						</li>
						<!--订单管理-->
						<li id="odermanager" class="center_right_dis_none ">
							<div class="change_customer_msg" style="width: 100%;">
								<div class="change_header">
									<p>
										<span class="msg-header_font">匹配管理</span>
									</p>
								</div>
								<div class="mgs_content">
									<div class="right_content" style="width: 100%; height: 480px;">
										<h3 class="mall_title">待审核的志愿服务</h3>
										<div class="mall_right_main">
											<div class="messrs_box">
												<table>
													<tr class="mes_th">
														<td>编号</td>
														<td>匹配时间</td>
														<td>老年人</td>
														<td>电话</td>
														<td>地址</td>
														<td>志愿者</td>
														<td>电话</td>
														<td>地址</td>
														<td>服务时间</td>
														<td>开始</td>
														<td>结束</td>
														<td width="56">操作</td>
													</tr>
													<c:forEach items="${backorderlist}" var="tabbean">
													<c:if test="${tabbean.getIsFlag() eq 0}">
														<form >
														<tr>
															<td>${tabbean.getOid()}</td>	
															<td>${tabbean.getOtime()}</td>
															<td>${tabbean.getEuname()}</td>
															<td>${tabbean.getEphone()}</td>
															<td>${tabbean.getEaddress()}</td>
															<td>${tabbean.getVname()}</td>
															<td>${tabbean.getVphone()}</td>
															<td>
																<p>${tabbean.getVaddress()}</p>
															</td>
															
															<td>${tabbean.getVdate()}</td>
															<td>${tabbean.getVtimeStart()}</td>
															<td>${tabbean.getVtimeEnd()}</td>
															
															<td><a href="javascript:void(0);"
																onclick="deleteMatch(${tabbean.getOid()},${tabbean.getVid()},${tabbean.getEid()})"
																class="revise_btn">删除</a><span>/</span><a href="javascript:void(0);"
																onclick="chooseMatch(${tabbean.getOid()},${tabbean.getVid()},${tabbean.getEid()})"
																class="revise_btn">匹配</a></td>
														</tr>
														</form>
														</c:if>
													</c:forEach>
												</table>
											</div>
										</div>
										<br/>
										<h3 class="mall_title">审核通过的志愿服务</h3>
										<div class="mall_right_main">
											<div class="messrs_box">
												<table>
													<tr class="mes_th">
														<td>编号</td>
														<td>匹配时间</td>
														<td>老年人</td>
														<td>电话</td>
														<td>地址</td>
														<td>志愿者</td>
														<td>电话</td>
														<td>地址</td>
														<td>服务时间</td>
														<td>开始</td>
														<td>结束</td>
														<td width="56">操作</td>
													</tr>
													<c:forEach items="${backorderlist}" var="tabbean">
													<c:if test="${tabbean.getIsFlag() eq 1}">
														<form >
														<tr>
															<td>${tabbean.getOid()}</td>	
															<td>${tabbean.getOtime()}</td>
															<td>${tabbean.getEuname()}</td>
															<td>${tabbean.getEphone()}</td>
															<td>${tabbean.getEaddress()}</td>
															<td>${tabbean.getVname()}</td>
															<td>${tabbean.getVphone()}</td>
															<td>
																<p>${tabbean.getVaddress()}</p>
															</td>
															
															<td>${tabbean.getVdate()}</td>
															<td>${tabbean.getVtimeStart()}</td>
															<td>${tabbean.getVtimeEnd()}</td>
															
															<td><a href="javascript:void(0);"
																class="revise_btn" style="color:red;">审核通过</a></td>
														</tr>
														</form>
														</c:if>
													</c:forEach>
												</table>
											</div>
										</div>
									</div>
								</div>

							</div>
				</li>
				<!--效果图-->
				<li id="effect_pic" class="center_right_dis_block  ">
					<div class="change_customer_msg" style="width: 100%;">
								<div class="change_header">
									<p>
										<span class="msg-header_font">老年人信息</span>
									</p>
								</div>
								<div class="mgs_content">
									<div class="right_content" style="width: 100%; height: 480px;">
										<h3 class="mall_title">符合要求的志愿者</h3>
										<div class="mall_right_main">
											<div class="messrs_box">
												<table>
													<tr class="mes_th">
														<td>编号</td>
														<td>用户名</td>
														<td>性别</td>
														<td>地址</td>
														<td>详细住址</td>
														<td>电话</td>
														<td>被选择</td>
														
													</tr>
													<c:forEach items="${backelder}" var="tabbean">
														<tr>
															<td id="vid">${tabbean.getVid()}</td>
															<td id="vname">${tabbean.getVuname()}</td>
															<td>${tabbean.getVsex()}</td>
															<td>${tabbean.getVaddress()}</td>
															<td>${tabbean.getVaddress3()}</td>
															<td>${tabbean.getVphone()}</td>
															<td><a href="javascript:void(0);" 
															class="revise_btn">${tabbean.getIsChoose()}</a></td>
														</tr>
													</c:forEach>
												</table>
											</div>
										</div>
									</div>
								</div>

				</div>
				</li>
				</ul>

			</div>
		</div>
	</div>


	</div>

</body>
</html>